{extend name="public/base" /}
{block name="style"}
<link rel="stylesheet" href="__PUBLIC__/admin/gzh/css/bbkz.css?v=20221110&times={:time()}" />
{include file="material/_ali_icon" /}
<link rel="stylesheet" href="__PUBLIC__/static/layui/css/layui.css">
<link rel="stylesheet" href="__PUBLIC__/admin/upload_layui/css/index.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/plugs/webuploader/webuploader.css">
<style>
.main-box-body .navs .active {
    background: azure;
    color: #03a9f4;
    border: 1px solid #03a9f4;
    border-radius: 5px;
}
a {
    color: #777;
	text-decoration:none;
}
a:hover { text-decoration :none}
.table tbody>tr>td {padding: 3px 8px;}
.table-hover>tbody>tr:nth-child(odd){background-color: #f9f9f9;}
.table-responsive {
    min-height: 470px;
}

</style>
<style>
	.uploadify-button-text{
		position: relative;
		display: inline-block;
		cursor: pointer;
		background: #fff;
		padding: 0px 5px;
		color: #333;
		text-align: center;
		border-radius: 3px;
		overflow: hidden;
		border: 1px solid #ccc;
	}
	em{
		color: red;
	}
	</style>
{/block}
{block name="body"}
<div class="main-box clearfix">
	<div class="main-box-header clearfix">
		<div class="pull-right">
			<button type="button" id="checkALL" class="btn btn-warning"> <input class="checkbox check-all" type="checkbox" style="display: inline-block;margin-top: -2px;vertical-align: middle;"> 全选 </button>
			<button type="button" class="btn btn-primary" id="createUrl">
				<i class="fa fa-plus"></i> 添加<span class="caret"></span>
			</button>
			<button class="btn btn-danger ajax-post confirm" url="{:url('del',array('type'=>'bbkz'))}" target-form="ids">删 除
			</button>
		</div>
		<div class="row">
			<form method="get">

				<style>
					@media (min-width: 1200px) {
						.col-lg-1 {
							width: 7.5%;
						}
					}
				</style>
				{include file="material/_date" /}
				<div class="col-sm-12 col-md-4 col-lg-2">
					<input type="text" class="form-control" name="keyword" value="" placeholder="请输入关键字搜索">
				</div>

				<div class="col-sm-12 col-md-1" style="width: 59px;">
					<button class="btn btn-primary" type="submit">搜索</button>
				</div>
				{if(!empty($userlist))}
				<div class="col-sm-12 col-lg-1">
					<select name="userid" id="userid" class="form-control">
						<option value="99999">全部工号</option>
						{foreach name="userlist" item="vo" key="k" }
						<option value="{$k}" {if input('get.userid')==$k}selected {/if}>{$vo}</option>
						{/foreach}
					</select>
				</div>
				{/if}

				<!-- 只有工作台下-抖音才能选择模板 -->

				<script src="/public/plugs/datepicker/js/foundation-datepicker.js"></script>
				<script>
					$('#startdata').fdatepicker({
						format: 'yyyy-mm-dd',
						// pickTime: true
					});
					$('#enddata').fdatepicker({
						format: 'yyyy-mm-dd',
						// pickTime: true
					});
					// 筛选框
					$(() => {

						$('#userid').change(() => {
							search()
						});

						function search(){
							let searchUrl = `?userid=${$('#userid').val()}`
							window.location.href= searchUrl
						}

					});
				</script>
			</form>
		</div>
	</div>
	<div class="main-box-body clearfix" style="padding-top:0">
		<div class="tiktok">
			<div class="container">
				<div class="toolTip" id="container">
					{volist name="list" id="vo"}
						<div class="panel panel-default">
							<div class="panel-body">
								{foreach $vo['img'] as $k => $v}
									<img src="{$v}" style="width: 100%;margin-bottom: 3px;" alt="">
								{/foreach}
							</div>
							<div class="panel-footer">
								<div style="flex: 1;width:0;margin-right: 5px;">
									<input class="ids row-selected" type="checkbox" name="id[]" value="{$vo.id}">
									<span>{$vo.name}</span>
								</div>
								<div>
									<a href="{:url('del',array('id'=>$vo['id'],'type'=>'bbkz'))}" class="ajax-get confirm"><i class="fa fa-times"></i> 删除</a>
								</div>
							</div>
							
						</div>
					{/volist}
				</div>
			</div>
		</div>
	</div>
</div>
<div class="modal fade" id="create-referral-link-modal">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
						aria-hidden="true">×</span></button>
				<span style="font-size: 20px;"><span id="referralname">添加</span></span>
			</div>
			<div class="modal-body">
                <div data-bind="visible: loading" class="loading-panel" style="display: none;">
                    <i class="fa fa-spin fa-spinner"></i>
                </div>
                <form class="form-horizontal modelform">
                    <div class="form-group models">
                        <label class="control-label col-sm-2">
                            书名</label>
                        <div class="col-sm-10">
							{foreach $bookList as $k => $v}
                            <label class="radio-inline">
                                <input type="radio" name="book_id" value="{$k}">
                                <span>{$v}</span>
                            </label>
							{/foreach}
                        </div>
                    </div>
					<div class="form-group">
						<label class="control-label col-sm-2">名称</label>
						<div class="col-sm-3">
							<input type="text" class="form-control" id="name" name="name"  placeholder="">
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-sm-2">上传</label>
						<input type="hidden" class="layui-input content" name="content" id="image_content">
						<div class="col-lg-9">
							<div>
								<div class="picker_button" id="upload_sample">
									<span>上传文件</span>
								</div>
								<input type="hidden" id="file_path" name="file_path" class="file_path">
								<input type="hidden" id="file_name" name="file_name">
							</div>
							<div id="fileList" class="upload-file-list-info"></div>
						</div>
					</div>
                </form>
            </div>
			<div class="modal-footer">
				<button type="button" id="createTwtitle" class="btn btn-primary ">提交</button>
			</div>
		</div>
	</div>
</div>

{/block}
{block name="script"}
<script type="text/javascript" src="__PUBLIC__/plugs/layer/layer.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugs/webuploader/webuploader.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugs/webuploader/webuploader.custom.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/mp.mansory.js"></script>
<script type="text/javascript">
	$("#createTwtitle").on('click',function(){
		var data = $('.modelform').serializeJson();
		$.ajax({
			type: "POST",
			url: "{:url('gzh/addBbkz')}",
			data:data,
			dataType: "json",
			success: function(data){
				if(data.code==1){
					updateAlert(data.msg, 'success');
					setTimeout(function() {
						window.location.reload();
					}, 100);
				}else{
					updateAlert("添加，"+data.msg, 'danger');
				}
			}
		})
	});
	$('#createUrl').on('click',function(){
		var $modal = $('#create-referral-link-modal');
		$modal.on('shown.bs.modal', function () {
			$('#upload_sample').html('<div>上传文件</div>')
			$("#upload_sample").SentUploader({
				server:"{:url('Upload/UploadPicture')}",
				fileNumLimit:100,
				hiddenName: 'file_path',
				hiddenFileName: 'file_name',
				listName: 'fileList',
				hiddenValType:2,
				fileSingleSizeLimit:50*1024*1024,
			});
		});	
		$modal.modal({backdrop: 'static', keyboard: false});
	});
	// 复制
    function copyContent(content, id){
        content = content.toString().replace(/<br\/>/g, `
    `)
        content = content.replace(/<em>|<\/em>/g,'');
        var oInput = document.createElement('textarea');
        oInput.value = content;
        document.body.appendChild(oInput);
        oInput.select();
        document.execCommand("Copy"); 
        oInput.className = 'oInput';
        oInput.style.display='none';
        var url = "{:url('copy')}";
        $.ajax({
            type: "POST",
            url,
            data:{id},
            dataType: "json",
            success: function(data){
                if(data.code==1){
                    layer.msg('复制成功');
                    setTimeout(function(){
                        window.location.reload();
                    }, 500)
                }else{
                    updateAlert("失败，"+data.msg, 'danger');
                }
            }
        })
    }
	jQuery(document).ready(function ( $ ) {
		$("#container").mpmansory({
			breakpoints:{
				lg: 3, 
				md: 4, 
				sm: 6,
				xs: 12
			},
		});
	});   
</script>
{/block}